<!DOCTYPE html>
<html>

	<head>
		<title>My WebSocket</title>
	</head>

	<body>
		Welcome<br/>
		<input id="text" type="text" /> <button onclick="sendMessage1()">Message</button> <button onclick="closeWebSocket()">Close</button> <input id="text" type="text" />
		<button onclick="login()">login</button> <button onclick="startmatch()">startmatch</button> <button onclick="joinmatch()">joinmatch</button> <button onclick="cancelmatch()">cancelmatch()</button> <button onclick="betpk()">betpk()</button> <button onclick="promotionEnroll()">promotionEnroll()</button> <button onclick="cancelEnroll()">cancelEnroll()</button> <button onclick="groupjoinroom()">groupjoinroom()</button>
		<button onclick="invite_friend()">invite_friend()</button>

		<button onclick="updatecurUserCount()">updatecurUserCount()</button>
		
		<button onclick="matchAgain()">matchAgain()</button>
		<button onclick="demandpk()">demandpk()</button>
		<button onclick="defeated()">defeated()</button>
		
		<div id="message">
		</div>
	</body>

	<script type="text/javascript">
		var websocket = null;
		var gameId = 1008;
		var matchRoom = null;
		//判断当前浏览器是否支持WebSocket
		if('WebSocket' in window) {
			websocket = new WebSocket("wss://lobby.xingqiu123.com/eliminatele");
//			websocket = new WebSocket("ws:/192.168.0.32:443/eliminatele");
		} else {
			alert('Not support websocket')
		}

		//连接发生错误的回调方法
		websocket.onerror = function() {
			setMessageInnerHTML("error");
		};

		//连接成功建立的回调方法
		websocket.onopen = function(event) {
			setMessageInnerHTML("open");
		}

		//接收到消息的回调方法
		websocket.onmessage = function(event) {
			setMessageInnerHTML(event.data);
			var respon = JSON.parse(event.data);
			if("matchsuccess"==respon.command){
				matchRoom = respon.value.room_name+"";
			}
		}

		//连接关闭的回调方法
		websocket.onclose = function() {
			setMessageInnerHTML("close");
		}

		//监听窗口关闭事件，当窗口关闭时，主动去关闭websocket连接，防止连接还没断开就关闭窗口，server端会抛异常。
		window.onbeforeunload = function() {
			websocket.close();
		}

		//将消息显示在网页上
		function setMessageInnerHTML(innerHTML) {
			document.getElementById('message').innerHTML += innerHTML + '<br/>';
		}

		//关闭连接
		function closeWebSocket() {
			websocket.close();
		}

		function login() { // 2955409
			//2946783
			var message = '{"command":"login","user_id":2955729}'; //自己
//			var message = '{"command":"login","user_id":2946783}';
			websocket.send(message);

		}

		function joinmatch() {
			var message = '{"command":"joinmatch","game_id":'+gameId+'}';
			websocket.send(message);
		}

		function cancelmatch() {
			var message = '{"command":"cancelmatch"}';
			websocket.send(message);
		}

		function startmatch() {
			console.log("matchRoom:"+matchRoom);
			var message = '{"command":"startmatch","game_id":'+gameId+',"room_name":'+'"'+matchRoom+'"'+'}';
//          var message = '{"command":"startmatch","game_id":'+gameId+',"room_name":"2955729_2946783"}';
			websocket.send(message);
		}

		function updatecurUserCount() {
			var message = '{"command":"updatecurUserCount","game_id":'+gameId+'}';
			websocket.send(message);
		}

		function betpk() {
			var message = '{"command":"betpk","user_bets":1800}';
			websocket.send(message);
		}

		function groupjoinroom() {
			var message = '{"command":"groupjoinroom","game_id":'+gameId+',"room_name":Group_14"}';
			websocket.send(message);
		}

		function invite_friend() {
			var message = '{"command":"invite_friend","type":2,"game_id":'+gameId+'}';
			websocket.send(message);
		}

		function promotionEnroll() {
			var message = '{"command":"promotionenroll","game_id":'+gameId+',"type_id":1}';
			websocket.send(message);
		}

		function cancelEnroll() {
			var message = '{"command":"cancelenroll","game_id":'+gameId+',"type_id":1}';
			websocket.send(message);
		}
		
		function matchAgain() {
			var message = '{"command":"matchagain","user_id":2946783}';
			websocket.send(message);
		}
		
		function demandpk(){
			var message = '{"command":"demandpk","user_bets":555}';
			websocket.send(message);
		}
		
		function defeated(){
			var message = '{"command":"defeated"}';
			websocket.send(message);
		}
	</script>

</html>